<!DOCTYPE HTML> 
<html>
<head>
	<meta charset="utf-8">
	<title>奔跑吧，大方块！</title>
	<script src="js/requestAnimationFrame.js"></script>
	<script src="js/until.js"></script>
	<script src="js/playObj.js"></script>

	<script src="js/canvasConsole.js"></script>
	<script src="js/gameConsole.js"></script>
	<script src="js/fireworksObj.js"></script>
	
	<script src="js/test.js"></script>
	<script src="js/main.js"></script>
	<!-- 	<script src="js/test.js"></script> -->
	<style>
		*{margin:0px}
		body, html { height: 100%;font-family: "微软雅黑" ;color: #FFFFFF;}
		#myCanvas{position: absolute;z-index: 1;top: 0px;left: 0px;}
		#hp_line{height: 15px;width:20%;position: absolute;left: 40%;background-color: #FFFFFF;top: 2px;z-index: 20;}
		#hp{height: 100%;width:100%;background-color: #996633;}
		#fps{position: absolute;right:10px;top:20px;z-index: 21;}
		#zdAmount{position: absolute;right:10px;top:40px;z-index: 21;}
		#injure_history{position: absolute;right:10px;top:60px;color: #996600;z-index: 21;}
		#result{position: absolute;left:30%;top:20%;z-index: 23;font-size: 80px;font-weight: bold;}
		#result small{font-size: 60%;font-weight: normal;}
		#game_over{position: absolute;left:0px;top:0px;background-color: rgba(200,200,200,0);z-index: 22;width: 100%;height: 100%;display: none;}
		#help_hp{width:50%;position: absolute;left: 25%;top: 20px;z-index: 20;font-size: 20px;line-height: 30px}
		#help{width:100%;position: absolute;left: 0;top: 100px;height:36%;z-index: 20;font-size: 20px;background: rgba(200,200,200,0.6);}
	</style>
</head>
<body > 

	<div id="hp_line" >
		<div id="hp"></div>
	</div>
	<div id="fps"></div>
	<div id="zdAmount"></div>
	<div id="injure_history"></div>
	<div id="game_over">

		<div id="help">
			<div id="help_hp">
				<h2>帮助 <small style="font-size:60%;">V0.2</small></h2>
				<p>操作竖方块进行飞行躲避子弹。</p>
				<p>上方为血条，隔1s增加1。被子弹达到减10。</p>
				<p>胜利条件：血条到达100</p>
				<p>失败条件：血条小于0</p>
				<p>操控：↑(W) ←(A) →(D)  , R 开始或重启游戏</p>
			</div>
		</div>
	</div>
	<canvas id="myCanvas" ></canvas>

</body> 
</html>